/**
 * Created by 游永年 on 2019-01-12 14:01.
 * 首页商品列表单体
 */


'use strict'
import React from 'react';
import testImg from '../../assets/yay.jpg';
import {Flex} from "antd-mobile";
import Pcenter from "./Pcenter";
import styles from './Product.less';

class Product extends React.Component {
  constructor(props) {
    super(props);
    this.state = {};
  }

  render() {
    const {data} = this.props;
    const {teacher} = data || {};
    const {banji} = data || {};
    const {classInfShow, priceShow = true} = this.props;
    const {image = testImg, teacherDesc = ''} = teacher || {};
    const {price = 100} = banji || {};

    // console.log('商品字段', data);
    return (
      <Flex onClick={this.onClick} justify={"center"} align={'stretch'}
            style={{padding: '0 15px', height: "6em"}} className={styles.item}>
        <img style={{width: '6em'}} src={image} alt="教师头像"/>
        <Pcenter teacher={teacher || {}} banji={banji} classInfShow={classInfShow}/>
        <div style={{lineHeight: 1,}}>
          <div style={{marginBottom: '8px', fontWeight: 'bold'}}>{teacherDesc}</div>
          {priceShow && <div><span style={{fontSize: '20px', color: '#FF6E27'}}>{price || 100}</span>/小时</div>}
        </div>
      </Flex>
    );
  }

  onClick = _ => {
    const {onClick, data} = this.props;
    !!onClick && onClick(data);
  }
}

Product.propTypes = {};

export default Product;
